<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@include file="../common/NavigationLeft.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>固定资产管理系统</title>
    <link type="text/css" href="/static/js/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet"/>
</head>
<body style="height: 100%">
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<h2 class="page-header"><a href="userList.action">返回用户列表</a></h2>
    <s:if test="data.id == null">
        <h2 class="page-header">添加用户</h2>
    </s:if>
    <s:if test="data.id != null">
        <h2 class="page-header">修改用户</h2>
    </s:if>
    <form id="commitForm" class="form-horizontal" method="post">
        <input id="userId"  type="hidden" name="user.id"  value="${id}"/>
        <div class="form-group">
            <label for="name_input" class="col-sm-2 control-label">用户名</label>
            <div class="col-sm-3">
                <input type="text" id="name" name="user.name" class="form-control" id="name_input"
                       placeholder="" value="${user.name}">
            </div>
        </div>       
        <div class="form-group">
            <label for="code_input" class="col-sm-2 control-label">用户编号</label>
            <div class="col-sm-3">
                <input type="text" id="code" name="user.code" value="${user.code}" class="form-control" id="code_input"
                       placeholder="">
                        <div style="display: none">
				    <p class='col-sm-12' style='color: red'>该编号号已被使用</p>
			    </div>
            </div>
        </div>
         <div class="form-group">
            <label for="password_input" class="col-sm-2 control-label">登录账号</label>
            <div class="col-sm-3">
                <input type="text" id="loginName" name="user.loginName" value="${user.loginName}" class="form-control" id="password_input"
                       placeholder="">
                <div style="display: none">
				    <p class='col-sm-12' style='color: red'>该登录账号已被注册</p>
			    </div> 
            </div>
        </div>
         <div class="form-group">
            <label for="password_input" class="col-sm-2 control-label">登录密码</label>
            <div class="col-sm-3">
                <input type="text" id="password" name="user.password" value="${user.password}" class="form-control" id="password_input"
                       placeholder="">      
            </div>
        </div>
        <div class="form-group">
            <label for="branchOfficeId" class="col-sm-2 control-label">所属子公司</label>
            <div class="col-sm-3">
                <select id="branchOfficeId" class="form-control" name="user.branchOffice">
                    <c:forEach var="item" items="${branchOfficeList}">
                    <option value="${item.id}" 
                            <c:if test="${item.id == user.branchOffice}" >selected="selected"</c:if> >
                        ${item.name}
                    </option>
                    </c:forEach>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label for="departmentId" class="col-sm-2 control-label">所属部门</label>
            <div class="col-sm-3">
					 <input id="depart_input" class="form-control" name="user.department" value="${user.department }">
                     <button type="button" id="chooseDepartButton">选择部门</button>
		   </div>
        </div>

        <div class="form-group">
            <label for="role" class="col-sm-2 control-label">角色</label>
            <div class="col-sm-4">
            <s:select list="#{0:'管理员',1:'普通用户'}" listKey="key" listValue="value" name="user.role"/>
            </div>
        </div>
        <div class="form-group">
            <label for="status" class="col-sm-2 control-label">状态</label>
            <div class="col-sm-4">
              <s:select list="#{0:'正常',1:'禁用'}" listKey="key" listValue="value" name="user.status"/>               
            </div>
        </div>
        <div class="form-group">
            <label for="code_input" class="col-sm-2 control-label">备注</label>
            <div class="col-sm-3">
                <input type="text" id="remark" name="user.remark" value="${user.remark}" class="form-control"
                       placeholder="备注">
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button id="submit_btn" type="submit"  class="btn btn-default">提交</button>
            </div>
        </div>
    </form>
    <div class="layer_panel" id="select_department_panel" >
        <div>
            <ul id="treeDemo" class="ztree"></ul>
        </div>
    </div>
</div>
<script type="text/javascript" src="/static/js/zTree/js/jquery.ztree.core.js"></script>
<script type="text/javascript">
    var zTreeObj;
    // zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）
    var setting = {
        callback:{
            onClick:function (event, treeId, treeNode) {
                var nodes = treeNode.getPath();
                var path = "";
                for(var index in nodes){
                    path = path+"/"+nodes[index].name;
                }
                path = path.substr(1);
                $("#depart_require_msg").html("");
                $("#depart_input").val(path);
            }
        },

    };
  
    $("#depart_input").focus(function () {
        layer.open({
            title: '选择部门',
            type: 1,
            area: ['400px'],
            content: $("#select_department_panel"),
            btn: ['确定', '取消'],
            yes: function(index, layero) {
                layer.close(index);
            },
            cancel: function(index) {}
        });
    })

 
    $("#chooseDepartButton").click(function(){
        layer.open({
            title: '选择部门',
            type: 1,
            area: ['400px'],
            content: $("#select_department_panel"),
            btn: ['确定', '取消'],
            yes: function(index, layero) {
                layer.close(index);
            },
            cancel: function(index) {}
        });
    });    

    $(function () {
        var departments;
        $("#departDiv-0").find("select").change();
        initSelectDepart();
        function initSelectDepart() {
            $.ajax({
                url:"/asset/ajax_listDepartments.action",
                type:"post",
                data:{departQueryName:'CTO中心'},
                success:function (data) {
                    zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, data);
                }
            })
        }
    })
  
    /*  $("#code").change(function(){
    	var code = $("#code").val();
    	$.ajax({
    		 type : 'POST',
             url : 'ajax_userListData.action',
             data : {"code":code},
             success : function(result) {
            	 if(result.operationResult == "1"){
            		 $("#code").next().show();
            	 }else{
            		 $("#code").next().hide();
            	 }            	                                           
             }
    	});
    });
    
     $("#loginName").change(function(){
    	var loginName = $("#loginName").val();
    	$.ajax({
    		 type : 'POST',
             url : 'ajax_userListData.action',
             data : {"loginName":loginName},
             success : function(result) {
            	 if(result.operationResult == "1"){
            		 $("#loginName").next().show();
            	 }else{
            		 $("#loginName").next().hide();
            	 }            	                                           
             }
    	});
    }); */
    
    $('#commitForm').validator({
      
    	rules: { 
    		loginNameRemote:function() {
    			
                   return $.ajax({
                	   url: "ajax_userListDataCheck.action",  //后台处理程序
                       type: "POST", //数据发送方式
                       data: {  //要传递的数据
                        	"loginName": function() {
                               return $("#loginName").val();                       
                           }
                       },
                       dataFilter: function (data) {//判断控制器返回的内容
                                return null;                         
                      } 
                   }  ) 
                },
          	  CodeRemote:function() {
        			
                  return $.ajax({
               	   url: "ajax_userListDataCheck.action",  //后台处理程序
                      type: "POST", //数据发送方式
                      data: {  //要传递的数据
                           "code": function(){
                       	   return $("#code").val();
                          }
                      },
                      dataFilter: function (data) {//判断控制器返回的内容
                               return null;                         
                     } 
                  }  ) 
               }
          },
    	fields:{
            "user.name":"required",
            "user.password":"required",
            "user.loginName":"required;loginNameRemote",
            "user.code":"required;CodeRemote"
        },
        valid: function(form) {
            var me = this;
            // Before submitting the form, hold form, to prevent duplicate submission.
            me.holdSubmit();
            var url = "";
            var id = $("#userId").val();
            if(id =='0' || id == ""){
                url="ajax_addUser.action";
            }else {
                url="ajax_modifyUser.action";
            }
            var departName = $("#depart_input").val();
            if(departName =="" || departName == undefined){
                $("#depart_require_msg").html('<b style="color: red">请选择部门</b>');
                me.holdSubmit(false);
                return;
            } 
             
            $.ajax({
                url:url,
                type:"post",
                data: $(form).serialize(),
                success:function (result) {
                    if(result == "success"){
                    	me.holdSubmit(false);
                        location.href="/asset/userList.action";  
                    }else{
                    	layer.msg("操作失败");
                    }
                },
                error:function () {
                    layer.msg("操作失败,服务器错误");
                }
            });   
        }
    });
</script>
</body>
</head>
</html>